<html>
  <head>
    <title>Webpage not available</title>

    <style type="text/css">

      :root {
         /* vars */
        --button-back-background: #1B72E7;
        --button-back-text: #FFFFFF;

        --button-browser-background: #FFFFFF;
        --button-browser-text: #6E7277;

        --explanation-text: #5F6368;

        --font-size-large: 3.5em;
        --font-size-medium: 2.18em;

      }

      body {
        padding: 0;
        margin: 0;
        overflow: hidden;

      }

      .container {
        width: 100vw;
        height: 100vh;
        padding: 0 5vw;
        box-sizing: border-box;
        display: flex;
        justify-content: center;
        flex-direction: column;
      }

      .spacer {
        min-height: 1px;
        flex: 1;
      }

      .warning-icon {
        margin-bottom: 3.5em;
      }

      .title {
        font-family: 'Roboto';
        font-size: var(--font-size-large);
        line-height: 1.5;
        margin-bottom: 0.5em;
      }

      .explanation { 
        font-family: 'Roboto';
        color: var(--explanation-text);
        line-height: 2;
        font-size: var(--font-size-medium);
        flex: 2;
      }
    
      button {
        border: 0;
        border-radius: 0.35em;
        background-color: var(--button-back-background);
        color: var(--button-back-text);

        font-weight: bold;
        font-size: var(--font-size-medium);

        height: 4em;
        user-select: none;
      }

      button.back-button {
        margin-bottom: 1em;
      }

      button.browser-button {
        margin-bottom: 3em;
        background-color: var(--button-browser-background);
        color: var(--button-browser-text);
      }

    </style>
 
</head>
    <body>
      <div class="container">
        <div class="spacer"></div>
      <div class="warning-icon">
          <svg width="200" height="200" viewBox="0 0 200 200" fill="none" xmlns="http://www.w3.org/2000/svg">
          <mask id="mask0_7_79" style="mask-type:alpha" maskUnits="userSpaceOnUse" x="8" y="16" width="184" height="159">
          <path fill-rule="evenodd" clip-rule="evenodd" d="M191.667 175L100 16.6667L8.33373 175H191.667Z" fill="#DA4437">
          </mask>
          <g mask="url(#mask0_7_79)">
          <path fill-rule="evenodd" clip-rule="evenodd" d="M191.667 175L100 16.6667L8.3335 175H191.667ZM91.6668 150V133.333H108.334V150H91.6668ZM91.6668 116.667H108.334V83.3333H91.6668V116.667Z" fill="#DA4437">
          <path d="M108.308 83.313L91.6392 116.651L171.163 196.163L199 174L108.308 83.313Z" fill="url(#paint0_linear_7_79)">
          <path d="M108.336 132.999L91.667 150.004L171.191 229.516L199.028 223.686L108.336 132.999Z" fill="url(#paint1_linear_7_79)">
          <g filter="url(#filter0_d_7_79)">
          <path d="M108.334 116.667H91.667V83.3333H108.334V116.667Z" fill="white">
          </g>
          <g filter="url(#filter1_d_7_79)">
          <path d="M91.667 133.333V150H108.334V133.333H91.667Z" fill="white">
          </g>
          </g>
          <defs>
          <filter id="filter0_d_7_79" x="87.667" y="79.3333" width="24.6667" height="41.3333" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB">
          <feFlood flood-opacity="0" result="BackgroundImageFix">
          <feColorMatrix in="SourceAlpha" type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0" result="hardAlpha">
          <feOffset>
          <feGaussianBlur stdDeviation="2">
          <feComposite in2="hardAlpha" operator="out">
          <feColorMatrix type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.25 0">
          <feBlend mode="normal" in2="BackgroundImageFix" result="effect1_dropShadow_7_79">
          <feBlend mode="normal" in="SourceGraphic" in2="effect1_dropShadow_7_79" result="shape">
          </filter>
          <filter id="filter1_d_7_79" x="87.667" y="129.333" width="24.6667" height="24.6667" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB">
          <feFlood flood-opacity="0" result="BackgroundImageFix">
          <feColorMatrix in="SourceAlpha" type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0" result="hardAlpha">
          <feOffset>
          <feGaussianBlur stdDeviation="2">
          <feComposite in2="hardAlpha" operator="out">
          <feColorMatrix type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.25 0">
          <feBlend mode="normal" in2="BackgroundImageFix" result="effect1_dropShadow_7_79">
          <feBlend mode="normal" in="SourceGraphic" in2="effect1_dropShadow_7_79" result="shape">
          </filter>
          <linearGradient id="paint0_linear_7_79" x1="91.6392" y1="116.876" x2="164.22" y2="188.767" gradientUnits="userSpaceOnUse">
          <stop stop-color="#202125" stop-opacity="0.1">
          <stop offset="0.776042" stop-color="#202125" stop-opacity="0">
          </linearGradient>
          <linearGradient id="paint1_linear_7_79" x1="91.667" y1="150.23" x2="164.248" y2="222.12" gradientUnits="userSpaceOnUse">
          <stop stop-color="#202125" stop-opacity="0.1">
          <stop offset="0.776042" stop-color="#202125" stop-opacity="0">
          </linearGradient>
          </defs>
          </svg>
        </div>
        <div class="title" >This site cannot be viewed in the current app</div>
        <div class="explanation">The current app is prevented from opening <b>$1</b> because it may intend to access and modify the site data or collect usage data without your permission.</div>
        <button class="back-button" >Go back</button>
        <button class="browser-button" >Open in default browser</button>
      </div>
    </body>
 
</html>